<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
<script type="text/javascript" src="./sjcl.js"></script>
</head>
<body>
  <form id="frm1" action="form_action.asp">
    Firstname: <input type="text" name="fname" id="fname"><br>
    Lastname: <input type="text" name="lname" id="lname"><br>
    Password: <input type="text" name="pwd" id="pwd"><br>
  <input type="button" value="Submit" id="btnAjaxSubmit">
  </form>
  <div></div>
<script>
$(document).ready(function () {
    $("#btnAjaxSubmit").click(function () {
    
      //获取各个字段参数
      var fname = $("#fname").val();
      var lname = $("#lname").val();
      var pwd   = $("#pwd").val();
      var ori_param  = 'fname=' + fname;
          ori_param += '&lname=' + lname;
          ori_param += '&pwd=' +pwd;
          
      //sjcl函数加密    
      var encry_str  = sjcl.encrypt("Encry_key", ori_param);
      
      //data字段附加
      var encry_data = 'data=' + encry_str;
      
      //post数据请求
      var options = {
          url: 'async_submit_test1.aspx?action=SaveUserInfo',
          type: 'post',
          dataType: 'text',
          data: encry_data,
          success: function (data) {
              if (data.length > 0)
                  $("#responseText").text(data);
          }
      };
      $.ajax(options);
      return false;
    });
  });
</script>
</body>
</html>